<template>
  <div class="myself_body">
      <label for="userPhone">手机号</label>
      <input id="userPhone" type="text" disabled v-model="phone">
      <label for="oldPassword">原密码</label>
      <input id="oldPassword" type="text" v-model="oldPassword">
      <label for="newPassword">新密码</label>
      <input id="newPassword" type="text" v-model="newPassword">
      <label for="newPassword_2">请再输一次</label>
      <input id="newPassword_2" type="text" v-model="newPassword_2">
      <button @click="savePassword">保 存</button>
  </div>
</template>

<script>
export default {
    data(){
        return {
            phone:null,
            oldPassword:null,
            newPassword:null,
            newPassword_2:null,
        }
    },
    mounted(){
        this.phone = this.$cookie.getCookie("phone");
    },
    methods:{
        savePassword(){
            if(this.oldPassword === null || this.newPassword === null || this.newPassword_2 === null){
                this.$msgBox.show("请输入完整","tip",250,60);
                return;
            }
            if(this.newPassword !== this.newPassword_2){
                this.$msgBox.show("两次输入的密码不一致","tip",300,60);
                return;
            }
            this.$axios.get("/wx/ChangePassword",{params:{
                phonenumber:this.phone,
                name:this.phone,
                password:this.$md5.MD5_Encrypt(this.oldPassword),
                newpassword:this.$md5.MD5_Encrypt(this.newPassword),
            }}).then(data=>{
                if(data.data.code == 200){
                    this.$msgBox.show("密码修改成功","success",250,60);
                }else{
                    this.$msgBox.show(data.data.msg,"error",280,60);
                }
            }).catch(error=>{
                this.$msgBox.show("服务器异常","error",250,60);
            })
        }
    }
}
</script>

<style scoped>
    .myself_body{
        max-width: 800px;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        padding: 10px;
    }
    .myself_body label{
        font-size: 13px;
        margin: 10px 0;
    }
    .myself_body input{
        border: 1px solid #e0e0e0;
        border-radius: 5px;
        outline-color: skyblue;
        box-sizing: border-box;
        padding: 5px;
    }
    .myself_body button{
        margin: 10px 0;
        padding: 10px;
        background-color: #67C23A;
        border: 1px solid #67C23A;
        border-radius: 5px;
        font-size: 15px;
        color: #fff;
    }
    
</style>
